<template>
  <div v-if="LOgData">
    <el-form label-position="top" :model="LOgData">
      <el-form-item label="变更次数">
        <el-input disabled :value="LOgData.count" />
      </el-form-item>
      <el-form-item label="设备名称">
        <el-input
          :value="
            codedetail.brand +
            '  ' +
            codedetail.goodsName +
            '  ' +
            codedetail.model +
            '  ' +
            codedetail.goodsSpecName
          "
          disabled
        />
      </el-form-item>
      <el-form-item label="所属公司">
        <el-input disabled :value="LOgData.username" />
      </el-form-item>
      <el-form-item label="联系手机">
        <el-input disabled :value="LOgData.phone" />
      </el-form-item>
      <el-form-item label="地址">
        <el-input
          disabled
          :value="LOgData.province + LOgData.city + LOgData.area + LOgData.town + LOgData.address"
        />
      </el-form-item>
      <el-form-item label="附件">
        <el-input disabled />
      </el-form-item>
      <el-form-item label="操作人">
        <el-input v-model="LOgData.createEmp" disabled />
      </el-form-item>
      <el-form-item label="操作时间">
        <el-input v-model="LOgData.createTime" disabled />
      </el-form-item>
    </el-form>
  </div>
</template>
<script lang="ts" setup>
  import { ref, toRefs } from 'vue'
  // 向父组件传值

  //子组件接收父组件传递过来的值
  const props = defineProps({
    LOgData: Object,
    codedetail: Object,
  })

  const { LOgData, codedetail } = toRefs(props)
  // const emit = defineEmits([])
  interface ListItem {
    value: string
    label: string
  }
  const list = ref<ListItem[]>([])
  const options = ref<ListItem[]>([])
  const value = ref<string[]>([])
  const loading = ref(false)

  const remoteMethod = (query: string) => {
    if (query) {
      loading.value = true
      setTimeout(() => {
        loading.value = false
        options.value = list.value.filter((item) => {
          return item.label.toLowerCase().includes(query.toLowerCase())
        })
      }, 200)
    } else {
      options.value = []
    }
  }
  defineExpose({})
</script>
<style lang="scss" scoped>
  :deep(.el-input .el-input__wrapper) {
    box-shadow: 0 0 0 2px transparent;
    height: 40px;
    box-sizing: border-box;
    background-color: #f4f5f5;
  }
  :deep(.el-form-item) {
    margin-bottom: 10px;
  }
  :deep(.el-form--default.el-form--label-top .el-form-item .el-form-item__label) {
    margin-bottom: 2px;
  }
  :deep(.el-input .el-input__wrapper) {
    height: 35px !important;
  }
  :deep(.el-drawer__header) {
    margin-bottom: 15px;
  }
</style>
